@import './style.less';

@fileUpload-prefix:          ~"@{prefix}-fileUpload";

.@{fileUpload-prefix} {
  &-select {
    display: inline-block;
    font-size: 12px;
    outline: 0;
    span {
      i {
        margin-right: 0.5em;
        &:before {
          content: "\E6B6";
        }
      }

      button {
        color: #666;
        background-color: transparent;
        transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
        position: relative;
        display: inline-block;
        margin-bottom: 0;
        font-weight: 500;
        text-align: center;
        cursor: pointer;
        background-image: none;
        border: 1px solid #d9d9d9;
        white-space: nowrap;
        line-height: 1.5;
        padding: 4px 15px;
        font-size: 12px;
        border-radius: @border-radius-base;
        user-select: none;

        &:hover {
          color: @primary-color;
          border-color: @primary-color;
        }
      }
    }
  }

  &-list {
    overflow: hidden;

    &-item {
      overflow: hidden;
      margin-top: 8px;
      font-size: 12px;

      &-info {
        height: 22px;
        line-height: 22px;
        padding: 0 4px;

        i:first-child {
          margin-right: 4px;
          font-size: 12px;
          color: #999;
          &:before {
            content: "\E676";
          }
        }

        &-remove {
          position: absolute;
          display: inline-block;
          font-size: 12px;
          zoom: 1;
          transition: all 0.3s ease;
          cursor: pointer;
          color: #999;
          line-height: 22px;
          margin-left: 5px;

          &:before {
            content: "\E633";
          }

          &:hover {
            color: rgb(255, 0, 0);
            font-size: 16px;
          }
        }
      }
    }
  }
}
